<template>
    <BaseEcharts :chatsOption="chatsOption"></BaseEcharts>
</template>

<script>
    import BaseEcharts from "../../../components/common/Cahrts/coreEcharts"

    export default {
        components: {
            BaseEcharts
        },
        data() {
            return {
                chatsOption: {
                    tooltip: {
                        trigger: 'axis',
                        formatter: '{b0}{a0}: {c0}<br />',
                        axisPointer: {
                            type: 'line',
                            label: {
                                backgroundColor: '#283b56'
                            }
                        },
                        textStyle: {
                            fontSize: 60,
                        },
                        padding: 20,
                        borderWidth: 4,
                        borderColor: "#48AFFF",
                        backgroundColor: "#010541",
                        extraCssText: "border-radius:20px;",

                    },
                    xAxis: [
                        {
                            type: 'category',
                            data: ["贷款人数", "累计放款人数", "授信人数"],
                            axisPointer: {
                                type: 'shadow'
                            },
                            axisLabel: {
                                fontSize: 40,
                                color: "#fff",
                            }
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value',
                            name: '水量',

                            splitLine: {
                                show: false,
                            },
                            nameTextStyle: {
                                color: "#ffff",
                                fontSize: 40,
                                align: "left",
                            },
                            axisLabel: {
                                formatter: '{value}',
                                fontSize: 40,
                                color: "#fff",
                            }
                        }

                    ],
                    series: [
                        {
                            name: '蒸发量',
                            type: 'bar',
                            itemStyle: {
                                color: "#22A6F0",
                            },
                            barMaxWidth: "30%",

                            label: {
                                normal: {
                                    show: true,
                                    position: 'top',
                                    fontSize: 25,
                                }
                            },
                            data: [20, 49, 70,]
                        },

                        {
                            name: '平均温度',
                            type: 'bar',
                            itemStyle: {
                                color: "#8B48E4",
                            },
                            barMaxWidth: "30%",
                            label: {
                                normal: {
                                    show: true,
                                    position: 'top',
                                    fontSize: 25,
                                }
                            },

                            areaStyle: {
                                color: {
                                    type: 'linear',
                                    x: 0,
                                    y: 0,
                                    x2: 0,
                                    y2: 1,
                                    colorStops: [{
                                        offset: 0, color: '#8B48E4' // 0% 处的颜色
                                    }, {
                                        offset: 1, color: '#020744' // 100% 处的颜色
                                    }],
                                }
                            },
                            data: [20, 20, 64,]

                        }
                    ]

                }
            }
        },

    }
</script>
